<!DOCTYPE html>
<html class="ui-page-login">

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title></title>
		<link href="css/mui.min.css" rel="stylesheet" />
		<link href="css/style.css" rel="stylesheet" />
		<style>
			body{
				background-color: #efeff4;
			}
			.mui-input-group {
				margin-top: 10px;
			}
			
			.mui-input-group:first-child {
				margin-top: 20px;
			}
			.img  span {
			    margin-bottom: 0rem;
			}
			.mui-input-group label {
				width: 22%;
			}
			.p{
				padding-top: 1rem;
				padding-bottom: 1rem;
			}
			.mui-input-row label~input,
			.mui-input-row label~select,
			.mui-input-row label~textarea {
				width: 78%;
			}
			
			.mui-checkbox input[type=checkbox],
			.mui-radio input[type=radio] {
				top: 6px;
			}
			
			.mui-content-padded {
				margin-top: 25px;
			}
			
			.mui-btn {
				padding: 10px;
			}
			
			.link-area {
				display: block;
				margin-top: 25px;
				text-align: center;
			}
			
			.spliter {
				color: #bbb;
				padding: 0px 8px;
			}
			
				.mui-bar.mui-bar-tab{
				background-color: #fff !important;
			}
			.uploader-demo1,.uploader-demo2,.uploader-demo3{
				width: 150px;
				height: 150px;
				margin:  0 auto;
				background-image: url('images/imgss.png');
				background-position: center;
				background-size: 150px 150px;
			}
			.webuploader-container {
				position: relative;
			}
			.webuploader-element-invisible {
				position: absolute !important;
				clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
			    clip: rect(1px,1px,1px,1px);
			}
			.webuploader-pick {
				position: relative;
				display: inline-block;
				width: 150px;
				height: 150px;
				cursor: pointer;
				background-image: url('images/imgss.png');
				background-position: center;
				background-size: 150px 150px;
			}
			.webuploader-pick-disable {
				opacity: 0.6;
				pointer-events:none;
			}
			.shch1,.shch2,.shch3{
				width: 80%;
				display: none;
				margin: 0 auto 1rem auto;
			}
			.mui-bar-tab~.mui-content{
				overflow: auto;
			}
			.mui-bar .mui-btn{
				top: 0px;
			}
			.mui-bar-tab{
				padding-top: 0px;	
			}
			#option{
				height: 50px;
			}
		</style>

	</head>

	<body>
		<header class="mui-bar mui-bar-nav">
			<span class="mui-action-back mui-icon mui-icon-arrowleft"></span>
			<h1 class="mui-title">实名开户</h1>
		</header>
		<nav class="mui-bar mui-bar-tab">
		    <button id='option' class="mui-btn mui-btn-block mui-btn-primary">提交</button>
		</nav>
		<div class="mui-content">
			<div id="guide" class="mui-input-row">
				<img style="width:100%;" src="images/bg11.png" alt="" />
			</div>
			<div class="mui-input-row one">
				<h4>基本资料</h4>
			</div>
			<form id='login-form' class="mui-input-group">
				<div class="mui-input-row">
					<input id='name' type="text" class="mui-input-clear mui-input" placeholder="请输入您的中文姓名，例如张三">
				</div>
				<div class="mui-input-row">
					<input id='IDCard' type="text" class="mui-input-clear mui-input" placeholder="请输入您的大陆居民身份证号">
				</div>
				<div class="mui-input-row">
					<input id='typeCard' type="text" class="mui-input-clear mui-input" placeholder="请输入银行卡类型，例如中国银行">
				</div>
				<div class="mui-input-row">
					<input id='bankCard' type="text" class="mui-input-clear mui-input" placeholder="请输入您要出金银行卡号">
				</div>
			</form>
			<div class="mui-input-row one">
				<h4>上传身份证</h4>
			</div>
			<form id='login-form' class="mui-input-group">
				<div id="feedback" class="mui-page feedback img">
			        <div class="p p_one">
			        	<a href="javascript:;" class="shch_link" id="imageup">
			        		<div class="uploader-demo1">
							    <!--用来存放item-->
							    <div id="fileList1" class="uploader-list"></div>
							    <div id="filePicker1"></div>
							</div>

			        	</a><br />
			        	<span >
				        	请上传身份证正面
				        </span>
				        <img class="shch1" src="" alt="" />
			        </div>
			        <!--<p><button onclick="upload();" class='button'> 提交</button></p>-->
			         <div class="p">
			        	<a href="javascript:;" class="shch_link" id="imageup1">
			        		<div class="uploader-demo2">
							    <!--用来存放item-->
							    <div id="fileList2" class="uploader-list"></div>
							    <div id="filePicker2"></div>
							</div>
			        	</a><br />
			        	<span >
			        		请上传身份证反面
			        	</span>
			        	<img class="shch2" src="" alt="" />
			        </div> 
			        <!--<p><button onclick="upload();" class='button'> 提交</button></p>-->
				</div>
			</form>
			<div class="mui-input-row one">
				<h4>上传银行卡</h4>
			</div>
			<form id='login-form' class="mui-input-group">
				<div id="feedback" class="mui-page feedback img" >
			        <div class="p">
			        	<a href="javascript:;" class="shch_link" id="imageup2">
			        		<div class="uploader-demo3">
							    <!--用来存放item-->
							    <div id="fileList3" class="uploader-list"></div>
							    <div id="filePicker3"></div>
							</div>
			        	</a><br />
			        	<span >
				        	请上传银行卡正面
				        </span>
				        <img class="shch3" src="" alt="" />
			        </div> 
				</div>
			</form>
		</div>
		<script src="js/mui.min.js"></script>
		<script src="js/mui.enterfocus.js"></script>
		<script src="js/app.js"></script>
		<script src="js/configs.js"></script>
		<!--<script src="js/uploda.js"></script>-->
		<script src="libs/easymob-webim-sdk/jquery-1.11.1.js"></script>
		<script src="js/dist/webuploader.min.js"></script>
		<script>
			var $$=jQuery.noConflict();
			mui.init();
			var old_back = mui.back;
			mui.back = function(){
				mui.plusReady(function() {
			        var list = plus.webview.getWebviewById('goldInOut.html');
					mui.fire(list,'refresh');
				})
			}
			var shenzhimg,shenfimg,yinhimg;
			$$(document).ready(function(){
			     var username = $$('#name'),
			     	 shenfan=$$('#IDCard'),
			     	 yinhka=$$('#typeCard'),
			     	 jinyinka=$$('#bankCard'),
			     	 tijiao=$$('#option'),
			     	 shenheimg=$$('#headimg');
			     	 
			    username.blur(function(){
			    	var cantent = jmz.checkStr(username.val());
			    	if(cantent !== true ){
			    		 mui.toast(cantent) ;
			    		return;
			    	}
			    });
			    shenfan.blur(function(){
			    	var cantent = jmz.isCardID(shenfan.val());
			    	if(cantent !== true ){
			    		 mui.toast(cantent) ;
			    		return;
			    	}
			    })
			    jinyinka.blur(function(){
			    	var cantent = jmz.TypeCard(jinyinka.val());
			    	if(cantent !== true ){
			    		 mui.toast(cantent) ;
			    		return;
			    	}
			    })
			    $$('#option').click(function(){
			    	var  usernamenum = username.val(),
			    	shenfannum = shenfan.val(),
			    	yinhkanum = yinhka.val(),
			    	jinyinkanum = jinyinka.val();
			    	if(!usernamenum){
			    		 mui.toast('名字不能为空') ;
			    		return;
			    	}else{
			    		var cantent = jmz.checkStr(usernamenum);
				    	if(cantent !== true ){
				    		mui.toast(cantent) ;
				    		return;
				    	}
			    	};
			    	if(!shenfannum){
			    		mui.toast('身份证号不能为空');
			    		return;
			    	}else{
			    		var cantent = jmz.isCardID(shenfannum);
				    	if(cantent !== true ){
				    		mui.toast(cantent);
				    		return;
				    	}
			    	};
			    	if(!yinhkanum){
			    		mui.toast('银行卡类型不能为空');
			    		return;
			    	};
			    	if(!jinyinkanum){
			    		mui.toast('出金银行卡号不能为空');
			    		return;
			    	}else{
			    		var cantent = jmz.TypeCard(jinyinkanum);
				    	if(cantent !== true ){
				    		mui.toast(cantent);
				    		return;
				    	}
			    	};
			    	if(!shenzhimg){
			    		mui.toast('身份证正面还没有上传');
			    		return;
			    	}
			    	if(!shenfimg){
			    		mui.toast('身份证反面还没有上传');
			    		return;
			    	}
			    	if(!yinhimg){
			    		mui.toast('银行卡正面还没有上传');
			    		return;
			    	}
			    	var account1 = localStorage.getItem("account");
//					var account1 = "13015582371";
			    	var _data ={
			    		account:account1,
			    		cardNo:yinhka.val(),
			  	  		username:username.val(),
			    		cardType:jinyinka.val(),
						idCardNo:shenfan.val(),
			   			idCardFront:shenzhimg,
						idCardBack:shenfimg,
						cardImg:yinhimg
			    	}
			    	console.log(_data)
			    	$$.post(server.stockopenanaccount,_data,function(data){
				    	mui.alert(data.msg,'提示','确定',function(){
				    		mui.openWindow({
				    			url:'users.html',
				    			id:'users.html'
				    		})
				    	});
				    })
			    });
			    uploader1 = WebUploader.create({
			        auto: true,
			        swf: 'js/dist/Uploader.swf',
			        server: imghost+'app/file/upImg',
			        pick: '#filePicker1',
			        accept: {
			            title: 'Images',
			            extensions: 'gif,jpg,jpeg,bmp,png',
			            mimeTypes: 'image/*'
			        }
			    });
				 uploader1.on( 'uploadSuccess', function( file,data ) {
			    	  shenzhimg = data._raw;
			    	  $$('.uploader-demo1').hide()
			    	  $$('.shch1').show().attr('src',imghost+shenzhimg).css('height','200px').prev().hide();
				 });
				uploader1.on('uploadError', function( file ) {
				    mui.toast('上传失败,请重新上传');
				})
				 uploader2 = WebUploader.create({
			        auto: true,
			        swf: 'js/dist/Uploader.swf',
			        server: imghost+'app/file/upImg',
			        pick: '#filePicker2',
			        accept: {
			            title: 'Images',
			            extensions: 'gif,jpg,jpeg,bmp,png',
			            mimeTypes: 'image/*'
			        }
			    });
				 uploader2.on( 'uploadSuccess', function( file,data ) {
			    	  shenfimg = data._raw;
			    	  $$('.uploader-demo2').hide()
			    	  $$('.shch2').show().attr('src',imghost+shenfimg).css('height','200px').prev().hide();
				 });
				 uploader2.on('uploadError', function( file ) {
				    mui.toast('上传失败,请重新上传');
				})
				 
				 
				 
				 uploader3 = WebUploader.create({
			        auto: true,
			        swf: 'js/dist/Uploader.swf',
			        server: imghost+'app/file/upImg',
			        pick: '#filePicker3',
			        accept: {
			            title: 'Images',
			            extensions: 'gif,jpg,jpeg,bmp,png',
			            mimeTypes: 'image/*'
			        }
			    });
				 uploader3.on( 'uploadSuccess', function( file,data ) {
			    	  yinhimg = data._raw;
			    	  $$('.uploader-demo3').hide()
			    	  $$('.shch3').show().attr('src',imghost+yinhimg).css('height','200px').prev().hide();
				 });
				uploader3.on('uploadError', function( file ) {
				    mui.toast('上传失败,请重新上传');
				})
				
				
			});
		</script>
	</body>

</html>